<template>
  <div class="product_dia">
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <el-row>
        <el-col :span="8">
          <el-form-item
            label="产品型号名称:"
            label-width="120px"
            prop="productName"
          >
            <el-input v-model="form.productName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="数据表" prop="dataForm">
            <el-input v-model="form.dataForm"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="产品状态">
            <el-select v-model="form.productStatus" placeholder="请选择">
              <el-option
                v-for="item in productState"
                :key="item.id"
                :label="item.itemText"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item
            label="单号前缀:"
            label-width="120px"
            prop="productPrefix"
          >
            <el-input v-model="form.productPrefix"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="列表模板" prop="listModel">
            <el-select v-model="form.listModel" placeholder="请选择">
              <el-option
                v-for="item in htmlList"
                :key="item.id"
                :label="item.htmlName"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="8">
          <el-form-item label="查看模板">
            <el-select
              v-model="showModel"
              placeholder="请选择"
              @change="htmlChange"
            >
              <el-option
                v-for="item in htmlList"
                :key="item.id"
                :label="item.htmlName"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col> -->
        <el-col :span="24">
          <el-form-item
            label="一句话介绍:"
            label-width="120px"
            prop="productBrief"
          >
            <el-input
              v-model="form.productBrief"
              type="textarea"
              :rows="1"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="排序值:"
            label-width="120px"
            prop="productTypeSort"
          >
            <el-input-number
              v-model="form.productTypeSort"
              :min="1"
              :max="100"
            ></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="产品分类:"
            label-width="120px"
            prop="productType"
          >
            <el-select v-model="form.productType" placeholder="请选择">
              <el-option
                v-for="item in productType"
                :key="item.itemValue"
                :label="item.itemText"
                :value="item.itemValue"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="推广分类:" label-width="120px" prop="appType">
            <el-select v-model="form.appType" placeholder="请选择">
              <el-option
                v-for="item in extensionData"
                :key="item.id"
                :label="item.value"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="能否添加到不动产:" label-width="130px">
                <el-select v-model="form.isBdc" placeholder="请选择">
                  <el-option
                    v-for="item in isBdcData"
                    :key="item.itemValue"
                    :label="item.itemText"
                    :value="item.itemValue"
                  ></el-option>
                </el-select>
              </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="移动专题代码:"
            label-width="120px"
            prop="moveSpecialCode"
          >
            <el-input
              v-model="form.moveSpecialCode"
              type="textarea"
              :rows="1"
            ></el-input>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="24">
          <el-form-item label-width="120px" label="产品图标:">
            <el-upload
              ref="bannerImg"
              class="upload-demo"
              accept="image/jpeg,image/jpg,image/png"
              action=""
              :on-change="proFileSele"
              :on-remove="remProFileSele"
              :on-preview="revProFile"
              :limit="1"
              :on-exceed="proFileExceed"
              :file-list="filelistIcon"
              :auto-upload="false"
            >
              <el-button type="success" size="mini" v-no-more-click
                >选择文件</el-button
              >
            </el-upload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="推广图片:" label-width="120px">
            <el-upload
              ref="bannerImg"
              class="upload-demo"
              accept="image/jpeg,image/jpg,image/png"
              action=""
              :on-change="genFileSele"
              :on-remove="remGenFileSele"
              :on-exceed="proFileExceed"
              :on-preview="revGenFile"
              :limit="1"
              :file-list="generalizeList"
              :auto-upload="false"
            >
              <el-button type="success" size="mini" v-no-more-click
                >选择文件</el-button
              >
              <span slot="tip" style="margin-left:10px" class="el-upload__tip"
                >推广广告图请预留二维码位，自动为经纪人直接带单</span
              >
            </el-upload>
          </el-form-item>
        </el-col> -->
        <el-col>
          <el-form-item label="推广文案:" label-width="120px">
            <el-input
              type="textarea"
              :rows="4"
              placeholder="请输入内容"
              v-model="form.generalizeText"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label-width="100px" label="是否列表显示:">
            <el-radio-group v-model="form.columnShow" size="small">
              <el-radio
                v-for="item in teamStatus"
                :key="item.id"
                :label="item.itemValue"
                >{{ item.itemText }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label-width="100px" label="合同模板下载:">
            <el-radio-group v-model="form.isContract" size="small">
              <el-radio
                v-for="item in isContractData"
                :key="item.id"
                :label="item.itemValue"
                >{{ item.itemText }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="是否能签约" label-width="120px">
            <el-select
              v-model="form.signSure"
              @change="signShow"
              placeholder="请选择"
            >
              <el-option
                v-for="item in signSureState"
                :key="item.itemValue"
                :label="item.itemText"
                :value="item.itemValue"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="signSureShow">
          <el-form-item label="签约期数:" label-width="120px" prop="signNum">
            <el-input-number
              v-model="form.signNum"
              style="width: 217px"
            ></el-input-number
            ><span class="dw">期</span>
          </el-form-item>
        </el-col>
        <el-col :span="12" v-if="signSureShow">
          <el-form-item label="签约比例:" label-width="120px" prop="signRatio">
            <el-input v-model="form.signRatio" style="width: 150px"></el-input
            ><span class="dw">%</span>
          </el-form-item>
        </el-col>
        <el-col :span="24" v-if="signSureShow">
          <el-form-item label-width="100px" label="结算方式:">
            <el-radio-group v-model="form.signModel" size="small">
              <el-radio
                v-for="item in signModelState"
                :key="item.id"
                :label="item.itemValue"
                >{{ item.itemText }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="归类显示:" label-width="100px">
            <el-checkbox-group v-model="classification">
              <el-checkbox
                v-for="item in classificationList"
                :key="item.itemText"
                :label="item.itemValue"
                >{{ item.itemText }}</el-checkbox
              >
            </el-checkbox-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-col :span="8">
            <el-form-item label="库存数量:" label-width="100px">
              <el-input v-model="form.inventory" type="number"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="每ID限:" label-width="100px">
              <el-input
                v-model="form.restrictSum"
                style="width: 150px"
                type="number"
              ></el-input
              ><span>件</span>
            </el-form-item>
          </el-col>
        </el-col>
        <el-col>
          <el-col :span="8">
            <el-form-item label-width="100px" label="计入团队收入:">
              <el-radio-group v-model="form.closePartner" size="small">
                <el-radio
                  v-for="item in teamStatus"
                  :key="item.id"
                  :label="item.itemValue"
                  >{{ item.itemText }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="5" v-if="teamStatusShow" class="flew_wrap">
            <el-form-item label="计算比例:">
              <el-input
                v-model="form.partnerRatio"
                style="width: 80px"
              ></el-input
              ><span class="dw">%</span>
            </el-form-item>
          </el-col>
          <el-col :span="5" v-if="teamStatusShow" class="flew_wrap">
            <el-form-item label="经纪人:">
              <el-input
                v-model="form.bonusBrokerRatio"
                style="width: 80px"
              ></el-input
              ><span class="dw">%</span>
            </el-form-item>
          </el-col>
          <el-col :span="5" v-if="teamStatusShow" class="flew_wrap">
            <el-form-item label="合伙人:">
              <el-input
                v-model="form.bonusPartnerRatio"
                style="width: 80px"
              ></el-input
              ><span class="dw">%</span>
            </el-form-item>
          </el-col>
        </el-col>
        <el-col :span="24">
          <el-form-item label="月费率:" label-width="100px">
            <el-input v-model="form.yearRate" style="width: 150px"></el-input
            ><span class="dw">%</span>
          </el-form-item>
        </el-col>
        <el-col class="ts" :span="24">
          <el-form-item label="全民经纪人佣金:" label-width="120px">
            <el-form-item label="收费说明" prop="brokerChargeExplain">
              <el-input v-model="form.brokerChargeExplain"></el-input>
            </el-form-item>
            <div class="flex">
              <el-form-item class="ts" label="区间:">
                <el-input
                  class="shortInp"
                  v-model="form.brokerMin"
                  style="width: 120px"
                ></el-input>
              </el-form-item>
              <el-form-item class="maglf" label="~" label-width="10px">
                <el-input
                  class="shortInp"
                  v-model="form.brokerMax"
                  style="width: 120px"
                ></el-input
                ><span class="dw">%</span>
              </el-form-item>
              <el-form-item label="附加收费">
                <el-input
                  class="shortInp"
                  v-model="form.brokerSubjoin"
                  style="width: 120px"
                ></el-input>
              </el-form-item>
            </div>
            <div class="flex two">
              <el-form-item label="提成比例:">
                <el-select v-model="form.brokerType" placeholder="请选择">
                  <el-option
                    v-for="item in brokerType"
                    :key="item.itemValue"
                    :label="item.itemText"
                    :value="item.itemValue"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-input v-model="form.brokerRatio"></el-input>
                <span v-show="showBrokerDw" class="dw">%</span>
              </el-form-item>
              <el-form-item label-width="100px" label="业绩不低于:">
                <el-input v-model="form.brokerMinMoney"></el-input>
              </el-form-item>
            </div>
            <el-form-item
              style="width: 100%"
              label-width="80px"
              label="提成说明:"
            >
              <el-input v-model="form.brokerExtract"></el-input>
            </el-form-item>
            <div class="flex two">
              <el-form-item label-width="80px" label="公司提成:">
                <el-input type="number" v-model="form.brokerCompany"></el-input>
                <span class="dw">%</span>
              </el-form-item>
              <el-checkbox v-model="formRadio.brokerChargeShow"
                >显示</el-checkbox
              >
            </div>
          </el-form-item>
        </el-col>
        <el-col class="ts" :span="24">
          <el-form-item label="内部员工佣金:" label-width="120px">
            <el-form-item label="收费说明" prop="employeeChargeExplain">
              <el-input v-model="form.employeeChargeExplain"></el-input>
            </el-form-item>
            <div class="flex">
              <el-form-item class="ts" label="区间:">
                <el-input
                  class="shortInp"
                  v-model="form.employeeMin"
                  style="width: 120px"
                ></el-input>
              </el-form-item>
              <el-form-item class="maglf" label="~" label-width="10px">
                <el-input
                  class="shortInp"
                  v-model="form.employeeMax"
                  style="width: 120px"
                ></el-input
                ><span class="dw">%</span>
              </el-form-item>
              <el-form-item label="附加收费">
                <el-input
                  class="shortInp"
                  v-model="form.employeeSubjoin"
                  style="width: 120px"
                ></el-input>
              </el-form-item>
            </div>
            <div class="flex two">
              <el-form-item label="提成比例:">
                <el-select v-model="form.employeeType" placeholder="请选择">
                  <el-option
                    v-for="item in employeeType"
                    :key="item.itemValue"
                    :label="item.itemText"
                    :value="item.itemValue"
                  ></el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-input v-model="form.employeeRatio"></el-input>
                <span v-show="showEmplDw" class="dw">%</span>
              </el-form-item>
              <el-form-item label-width="100px" label="业绩不低于:">
                <el-input v-model="form.employeeMinMoney"></el-input>
              </el-form-item>
            </div>
            <el-form-item
              style="width: 100%"
              label-width="80px"
              label="提成说明:"
            >
              <el-input v-model="form.empExtract"></el-input>
            </el-form-item>
            <div class="flex two">
              <el-form-item label-width="80px" label="公司提成:">
                <el-input type="number" v-model="form.empCompany"></el-input>
                <span class="dw">%</span>
              </el-form-item>
              <el-checkbox v-model="formRadio.employeeChargeShow"
                >显示</el-checkbox
              >
            </div>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <div class="flex">
            <el-form-item label="线下渠道人提成:" label-width="120px">
              <el-select v-model="form.downType" placeholder="请选择">
                <el-option
                  v-for="item in downType"
                  :key="item.itemValue"
                  :label="item.itemText"
                  :value="item.itemValue"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="新增比例:" label-width="120px">
              <el-input
                v-model="form.downNewRatio"
                style="width: 120px"
              ></el-input>
              <span class="dw">%</span>
            </el-form-item>
            <el-form-item label="存量比例:" label-width="120px">
              <el-input
                v-model="form.downOldRatio"
                style="width: 120px"
              ></el-input>
              <span class="dw">%</span>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="24">
          <div class="flex">
            <el-form-item label="线上渠道人提成:" label-width="120px">
              <el-select v-model="form.upType" placeholder="请选择">
                <el-option
                  v-for="item in upType"
                  :key="item.itemValue"
                  :label="item.itemText"
                  :value="item.itemValue"
                >
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="新增比例:" label-width="120px">
              <el-input
                v-model="form.upNewRatio"
                style="width: 120px"
              ></el-input>
              <span class="dw">%</span>
            </el-form-item>
            <el-form-item label="存量比例:" label-width="120px">
              <el-input
                v-model="form.upOldRatio"
                style="width: 120px"
              ></el-input>
              <span class="dw">%</span>
            </el-form-item>
          </div>
        </el-col>
        <el-col :span="24">
          <el-form-item label="PC表单代码:" label-width="120px" prop="pcCode">
            <el-input
              type="textarea"
              :rows="4"
              placeholder="请输入内容"
              v-model="form.pcCode"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item
            label="小程序表单代码:"
            label-width="120px"
            prop="minProcedureCode"
          >
            <el-input
              type="textarea"
              :rows="4"
              placeholder="请输入内容"
              v-model="form.minProcedureCode"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-col :span="9">
            <el-form-item label="审批流:" label-width="120px">
              <el-radio-group v-model="radio" @change="changeHandler">
                <el-radio class="radio" label="1">否</el-radio>
                <el-radio class="radio" label="2">是</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              v-if="this.radio == 2"
              label-width="0"
              prop="approveFlowId"
            >
              <el-select v-model="form.approveFlowId" placeholder="请选择">
                <el-option
                  v-for="item in approveModelList"
                  :key="item.id"
                  :label="item.approveFlowName"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="close" v-no-more-click>取 消</el-button>
      <el-button type="primary" @click="submit" v-no-more-click
        >确 定</el-button
      >
    </span>
    <el-dialog
      title="详情"
      :visible.sync="dialogCanter"
      width="30%"
      append-to-body
    >
      <span>{{ canter }}</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogCanter = false" v-no-more-click
          >关 闭</el-button
        >
      </span>
    </el-dialog>
    <div>
      <el-dialog
        title="查看图片"
        :visible.sync="dialogVisPho"
        :modal="false"
        width="30%"
      >
        <el-image :src="src"></el-image>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisPho = false" v-no-more-click
            >关 闭</el-button
          >
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import {
  getProductOne,
  getAstatus,
  getProductHtml,
  getProductApproveModel,
  getProducthtmlById,
  getEtExtension,
} from "../../../src/assets/js/api";
export default {
  name: "ProductDialog",
  props: ["dialogVisible", "productId", "getList"],
  data() {
    // 为空校验
    var validateNull = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("必填项不能为空"));
      } else {
        callback();
      }
    };
    // selecr为空
    var validateSelect = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("必选项不能为空"));
      } else {
        callback();
      }
    };
    // 数字校验
    var validateNumber = (rule, value, callback) => {
      if (!value) {
        return callback(new Error("必填项不能为空"));
      }
      setTimeout(() => {
        if (!Number(value)) {
          callback(new Error("请输入数字值"));
        } else {
          callback();
        }
      }, 1000);
    };
    return {
      dialogVisPho: false,
      src: "",
      form: {
        closePartner: 0,
        columnShow: 0,
        isContract: 0,
        productStatus: 1,
        brokerType: 1,
        employeeType: 1,
        productSaveName: "",
        productTypeSort: 1,
        productType: 1,
        signSure: "0",
        appType: "",
        isBdc:"",
      },
      signSureShow: false,
      filelistIcon: [],
      generalizeList: [],
      formRadio: {
        brokerChargeShow: false,
        employeeChargeShow: false,
      },
      isBtnShowR: false,
      classificationList: [],
      classification: [],
      radio: "1",
      checked: true,
      options: [],
      productState: [],
      signSureState: [],
      signModelState: [],
      // 列表数据
      htmlList: [],
      // 审批流数据
      approveModelList: [],
      // 详情对话框
      dialogCanter: false,
      canter: "",
      showModel: "",
      teamStatus: [],
      //线下渠道人
      downType: [],
      //线上渠道人
      upType: [],
      //全民经纪人佣金提成比例
      brokerType: [],
      employeeRatio: [],
      //内部员工提成比例
      employeeType: [],
      //产品分类
      productType: [],
      isContractData: [],
      extensionData: [],
      isBdcData:[],
      // 表单校验
      rules: {
        productName: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        productPrefix: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        dataForm: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        productBrief: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        moveSpecialCode: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        pcCode: [{ validator: validateNull, trigger: "blur", required: true }],
        minProcedureCode: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        brokerChargeExplain: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        employeeChargeExplain: [
          { validator: validateNull, trigger: "blur", required: true },
        ],
        productStatus: [
          { validator: validateSelect, trigger: "change", required: true },
        ],
        signSure: [
          { validator: validateSelect, trigger: "change", required: true },
        ],
        listModel: [
          { validator: validateSelect, trigger: "change", required: true },
        ],
        approveFlowId: [
          { validator: validateSelect, trigger: "change", required: true },
        ],
        // 数字
        yearRate: [
          { validator: validateNumber, trigger: "change", required: true },
        ],
        brokerRatio: [
          { validator: validateNumber, trigger: "change", required: true },
        ],
        employeeRatio: [
          { validator: validateNumber, trigger: "change", required: true },
        ],
        inventory: [
          { validator: validateNumber, trigger: "change", required: true },
        ],
        restrictSum: [
          { validator: validateNumber, trigger: "change", required: true },
        ],
      },
    };
  },
  computed: {
    teamStatusShow: function () {
      if (this.form.closePartner == 1) {
        return true;
      } else {
        return false;
      }
    },
    showEmplDw: function () {
      if (this.form.employeeType == 3) {
        return false;
      } else {
        return true;
      }
    },
    showBrokerDw: function () {
      if (this.form.brokerType == 3) {
        return false;
      } else {
        return true;
      }
    },
    isBtnShow: function () {
      if (this.form.productSaveName) {
        return true;
      } else {
        return false;
      }
    },
  },
  created() {
    this.getProduct(this.productId);
    this.getAstatus();
    this.getProductHtml();
    this.getProductApproveModel();
    this.getAppType();
  },
  methods: {
    // 审核流点击“否”清空下拉框数据
    changeHandler(value) {
      if (value == 1) {
        this.form.approveFlowId = "";
      }
    },
    signShow(obj) {
      if (obj == 1) {
        this.signSureShow = true;
      } else {
        this.signSureShow = false;
      }
    },
    //获取数据
    getProduct(id) {
      if (this.productId === true) {
        return;
      }
      getProductOne(id).then((res) => {
        let arrIcon = {};
        let arrBar = {};
        this.form = res.data;
        this.form.columnShow = parseInt(this.form.columnShow);
        for (let key in this.form) {
          if (this.form[key] == null) {
            this.form[key] = "";
          }
        }
        if (res.data.signSure == 1) {
          this.signSureShow = true;
        } else {
          this.signSureShow = false;
        }
        //判断是否有产品图标
        if (res.data.productShowName) {
          arrIcon.name = res.data.productShowName;
          arrIcon.url = res.data.productSaveName;
          this.filelistIcon.push(arrIcon);
        }
        //判断是否有推广图片
        if (res.data.generalizeShowName) {
          arrBar.name = res.data.generalizeShowName;
          arrBar.url = res.data.generalizeSaveName;
          this.generalizeList.push(arrBar);
        }
        let array = res.data.classification;
        if (array) {
          this.classification = array.split(",");
        }
        if (this.form.brokerChargeShow == 1) {
          this.formRadio.brokerChargeShow = true;
        } else {
          this.formRadio.brokerChargeShow = false;
        }
        if (this.form.employeeChargeShow == 1) {
          this.formRadio.employeeChargeShow = true;
        } else {
          this.formRadio.employeeChargeShow = false;
        }
        if (res.data.approveFlowId) {
          this.radio = "2";
        } else {
          this.radio = "1";
        }
      });
    },
    // 获取app推广类型
    getAppType() {
      getEtExtension().then((res) => {
        this.extensionData = res.data;
      });
    },
    // 获取列表模板数据
    getProductHtml() {
      getProductHtml().then((res) => {
        this.htmlList = res.data;
      });
    },
    // 根据模板数据查询详情
    htmlChange(id) {
      getProducthtmlById(id).then((res) => {
        if (res.code == 200) {
          if (!res.data.htmlCode) {
            this.$message({
              message: "暂无数据",
              type: "warning",
            });
          } else {
            this.dialogCanter = true;
            this.canter = res.data.htmlCode;
          }
        } else {
          this.$message({
            message: res.message,
            type: "error",
          });
        }
      });
    },
    // 获取审批流数据
    getProductApproveModel() {
      getProductApproveModel().then((res) => {
        this.approveModelList = res.data;
      });
    },
    // 查询字典产品状态
    getAstatus() {
      getAstatus("products_state").then((res) => {
        let arr = res.data;
        let arr2 = arr.map(function (arr) {
          arr.id = parseInt(arr.itemValue);
          return arr;
        });
        this.productState = arr2;
      });
      getAstatus("whether_state").then((res) => {
        this.signSureState = res.data;
      });
      getAstatus("is_contract").then((res) => {
        this.isContractData = res.data;
      });
      getAstatus("whether_state").then((res) => {
        this.whetherData = res.data;
      });
      getAstatus("is_stages").then((res) => {
        this.isBdcData = res.data;
      });
      
      //查询归类字典
      getAstatus("classification").then((res) => {
        this.classificationList = res.data;
        //this.whetherData = res.data;
      });
      //查询是否
      getAstatus("partner_status").then((res) => {
        let arr = res.data;
        let arr2 = arr.map(function (arr) {
          arr.id = parseInt(arr.itemValue);
          arr.itemValue = parseInt(arr.itemValue);
          return arr;
        });
        this.teamStatus = arr2;
      });
      getAstatus("sign_model").then((res) => {
        this.signModelState = res.data;
        //this.whetherData = res.data;
      });
      // //全民经纪人佣金提成比例
      // brokerType: [],
      getAstatus("broker_ratio").then((res) => {
        this.brokerType = res.data;
        this.brokerType.map((item) => {
          item.itemValue = parseInt(item.itemValue);
        });
      });
      // //内部员工提成比例
      // employeeType: []
      getAstatus("emp_ratio").then((res) => {
        this.employeeType = res.data;
        this.employeeType.map((item) => {
          item.itemValue = parseInt(item.itemValue);
        });
      });
      //线下渠道人
      // downType: [],
      getAstatus("down_type").then((res) => {
        this.downType = res.data;
        this.downType.map((item) => {
          item.itemValue = parseInt(item.itemValue);
        });
      });
      // //线上渠道人
      // upType: [],
      getAstatus("up_type").then((res) => {
        this.upType = res.data;
        this.upType.map((item) => {
          item.itemValue = parseInt(item.itemValue);
        });
      });
      //查询产品分类
      getAstatus("product_type").then((res) => {
        this.productType = res.data;
        this.productType.map((item) => {
          item.itemValue = parseInt(item.itemValue);
        });
      });
    },
    //点击取消按钮
    close() {
      this.$emit("dialogVisible", false);
    },
    //提交按钮
    submit() {
      let thisObj = this;
      let classifList = thisObj.classification.join(",");
      thisObj.form.classification = classifList;
      this.$refs.form.validate((valid) => {
        if (valid) {
          if (this.formRadio.brokerChargeShow == true) {
            this.form.brokerChargeShow = 1;
          } else {
            this.form.brokerChargeShow = 0;
          }
          if (this.formRadio.employeeChargeShow == true) {
            this.form.employeeChargeShow = 1;
          } else {
            this.form.employeeChargeShow = 0;
          }
          if (this.productId === true) {
            this.saveProduct();
          } else {
            this.updateProduct();
          }
        } else {
          return false;
        }
      });

      //this.$emit("dialogVisible", false);
    },
    //新增
    saveProduct() {
      let that = this;
      const formData = new FormData();
      Object.keys(this.form).forEach((key) => {
        formData.append(key, this.form[key]);
      });
      this.axios
        .post("/business/product/save", formData, {
          //请求头配置
          headers: {
            "Content-Type": "multipart/form-data",
          },
        })
        .then(function (res) {
          if (res.data.code == 200) {
            that.$message({
              message: res.data.message,
              type: "success",
            });
            that.getList();
            that.$emit("dialogVisible", false);
          } else {
            that.$message({
              message: res.data.message,
              type: "error",
            });
          }
        })
        .catch(function (error) {
          that.$message({
            message: error.message,
            type: "error",
          });
        });
    },
    //修改
    updateProduct() {
      let that = this;
      // const formData = new FormData();
      // Object.keys(this.form).forEach(key => {
      //   formData.append(key, this.form[key]);
      // });
      let data = JSON.stringify(this.form);
      
      this.axios
        .post("/business/product/update", data, {
          headers: {
            "Content-Type": "application/json",
          },
        })
        .then(function (res) {
          if (res.data.code == 200) {
            that.$message({
              message: res.data.message,
              type: "success",
            });
            that.getList();
            that.$emit("dialogVisible", false);
          } else {
            that.$message({
              message: res.data.message,
              type: "error",
            });
          }
        })
        .catch(function (error) {
          that.$message({
            message: error.message,
            type: "error",
          });
        });
    },
    //选择产品图标
    proFileSele(file) {
      this.form.productShowName = file.name;
      this.form.productFile = file.raw;
      let URL = window.URL || window.webkitURL;
      file.url = URL.createObjectURL(file.raw);
    },
    //移除产品图标
    remProFileSele() {
      this.form.productShowName = "n";
      this.form.productFile = "n";
    },
    proFileExceed() {
      this.$message.error("只允许上传一个文件");
    },
    revProFile(file) {
      this.dialogVisPho = true;
      this.src = file.url;
    },
    //选择推广图片
    genFileSele(file) {
      this.form.generalizeFile = file.raw;
      this.form.generalizeShowName = file.name;
      let URL = window.URL || window.webkitURL;
      file.url = URL.createObjectURL(file.raw);
    },
    //移除推广图片 n为删除照片
    remGenFileSele() {
      this.form.generalizeShowName = "n";
      this.form.generalizeFile = "n";
    },
    revGenFile(file) {
      this.dialogVisPho = true;
      this.src = file.url;
    },
  },
};
</script>

<style scoped type="less">
::v-deep .el-form-item__content {
  text-align: left;
}
::v-deep .el-input__inner {
  height: 30px;
}
::v-deep .el-row {
  margin: 0;
  padding: 0;
}
::v-deep .el-col {
  margin: 0;
  padding: 0;
}
::v-deep .el-select--medium {
  vertical-align: bottom !important;
}
.product_dia .el-form-item {
  margin-bottom: 15px;
}
.flew_wrap ::v-deep.el-form-item__content {
  display: flex;
}
.flex {
  display: flex;
}
.ts .el-form-item {
  margin-bottom: 12px;
}
.ts > .el-form-item {
  margin-bottom: unset;
}
.dw {
  margin-left: 10px;
}
.flex.two .el-form-item:not(:first-child) {
  padding: 0 10px;
}
.flex .ts {
  width: 200px;
}
.maglf ::v-deep.el-form-item__label {
  margin-left: 5px;
}
.el-input-number {
  height: 32px;
  line-height: 30px;
}
</style>
<style>
.flex .el-form-item__content {
  display: flex;
}
</style>
